<template>
    <!-- 用餐台账 -->
    <base-breadcrumb :title="$route.meta.title">
        <a-card :bordered="false">
            <title-name title="基本信息"></title-name>
            <a-form-model
                ref="ruleForm"
                :model="form"
                :label-col="{ span: 6 }"
                :wrapper-col="{ span: 18 }"
                :rules="editModel != 0 ? rules : {}"
            >
                <a-row :gutter="24">
                    <a-col :md="8" :sm="8">
                        <a-form-model-item label="单位">
                            <BaseInput disabled v-model="unitName"></BaseInput>
                        </a-form-model-item>
                    </a-col>
                    <a-col :md="8" :sm="8">
                        <a-form-model-item label="月份">
                            <BaseInput disabled v-model="mealMonthTime"></BaseInput>
                        </a-form-model-item>
                    </a-col>
                </a-row>
            </a-form-model>
        </a-card>
        <!-- 表格 -->
        <a-card :bordered="false">
            <title-name title="用餐明细"></title-name>

            <!-- 表格 -->
            <s-table
                ref="table"
                tableLayout="fixed"
                size="default"
                rowKey="key"
                :columns="columns"
                :data="loadData"
                :alert="true"
                show-size-changer
                show-quick-jumper
                :showPagination="false"
            >
                <span slot="index" slot-scope="text, record, index">{{
                    form.data.length != index + 1 ? index + 1 : ''
                }}</span>
            </s-table>
        </a-card>
            
        <div class="tool-btns mb20 page-btn-right-top">
            <a-button class="ml20" type="primary" @click="handleClose">关闭</a-button>
        </div>
    </base-breadcrumb>
</template>

<script>
import { STable } from '@/components' // 表格
import { getPageSelectReportByMonth, getSelectReportByDay } from '@/api/office/canteen' // api
import BaseEditPage from '@/views/baseEditPage' // 编辑详情页基础配置
import SelectCompanyAndProject from '@/components/Select/SelectCompanyAndProject'
import ServiceExportMould from '@/components/ServiceExportMould'
const searchArr = [
    // 搜索框
    {
        name: '单位',
        valueKey: 'unitId',
        type: SelectCompanyAndProject
    },
    {
        name: '用餐月份',
        type: 'month',
        value: 'mealMonthTime',
        attrs: {
            valueFormat: 'YYYY-MM'
        }
    }
]
const columns = [
    {
        title: '序号',
        width: 80,
        dataIndex: 'index',
        scopedSlots: { customRender: 'index' }
    },
    {
        title: '用餐日期',
        dataIndex: 'mealTime'
    },
    {
        title: '标准人数',
        ellipsis: true,
        dataIndex: 'normNum'
    },
    {
        title: '早餐人数',
        ellipsis: true,
        dataIndex: 'breakfast'
    },
    {
        title: '早餐金额(元)',
        ellipsis: true,
        dataIndex: 'breakfastMoney'
    },
    {
        title: '午餐人数',
        ellipsis: true,
        dataIndex: 'lunch'
    },
    {
        title: '午餐金额(元)',
        ellipsis: true,
        dataIndex: 'lunchMoney'
    },
    {
        title: '晚餐人数',
        ellipsis: true,
        dataIndex: 'dinner'
    },
    {
        title: '晚餐金额(元)',
        ellipsis: true,
        dataIndex: 'dinnerMoney'
    },
    {
        title: '日合计(元)',
        ellipsis: true,
        dataIndex: 'dayMoney'
    }
]

export default {
    extends: new BaseEditPage(),
    components: {
        STable
    },
    data() {
        this.columns = columns
        this.searchArr = searchArr
        return {
            visible: {
                update: false
            },
            loading: false,
            queryParam: { unitId: this.unitId, mealMonthTime: this.mealMonthTime }, // 查询参数
            form: {},
            loadData: (parameter) => {
                const requestParameters = Object.assign({}, parameter, {
                    unitId: this.unitId,
                    mealMonthTime: this.mealMonthTime
                })
                return getSelectReportByDay(requestParameters).then((res) => {
                    let total = {
                        mealTime: '合计',
                        normNum: 0,
                        breakfast: 0,
                        breakfastMoney: 0,
                        lunch: 0,
                        lunchMoney: 0,
                        dinner: 0,
                        dinnerMoney: 0,
                        dayMoney: 0
                    }
                    res.data.forEach((element, i) => {
                        res.data.key = i
                        total.normNum += element.normNum
                        total.breakfast += element.breakfast
                        total.breakfastMoney += element.breakfastMoney
                        total.lunch += element.lunch
                        total.lunchMoney += element.lunchMoney
                        total.dinner += element.dinner
                        total.dinnerMoney += element.dinnerMoney
                        total.dayMoney += element.dayMoney
                    })
                    res.data.push(total)
                    this.form = res
                    return res
                })
            }, // 加载数据方法 必须为 Promise 对象

            editModel: 0
        }
    },
    mounted() {
        console.log(this)
    },

    methods: {
        handleClose() {
            this.$multiTab.close(this.$route.fullpath)
        }
    }
}
</script>
